chromef12mobileview

To view the mobile version of a website using Chrome’s Developer Tools: Open the website on a new tab and press F12 on your keyboard. You can also right-click on anywhere on the webpage and select Inspect. On the inspect element toolbar, select the

都可以用 Chrome 的開發工具，不用安裝任何延伸套件 (extension)，是內建的工具，天然的最好！ 模擬手機瀏覽器、觸控手勢：F12 → 右下角的設定 → Override User Agent → (選取你要的手機)。 右下角設定 → Emulate Touch Event (打勾) 可以模擬手機/平板電腦的觸控手勢。 查看網頁錯誤、直接寫程式：F12 → Console：可以直接執行簡單的語法。 如果寫式的錯誤，也會在這邊出現。

例如，”User-Agent Switcher for Chrome”擴充功能可以切換瀏覽器的User-Agent，讓網站誤以為你是使用手機瀏覽器，從而載入手機版網頁。

Chrome Device Mode 裝置模擬 今天我們來介紹 Google Chrom DevTools 中的「裝置模擬 Device Mode」功能。 現今的 WEB 開發人員常常會遇到 行動裝置 或是 RWD 的相關測試問題，裝置模擬 Device Mode 功能它能協助我們在這裝置相容性上，有簡易且快速的模擬測試的環境。

如果你經常需要使用電腦Chrome瀏覽器檢視手機版網頁，就讓Chrome開發者工具來幫忙吧！ 用它來模擬手機/平板畫面，方便又實用！